<template>
  <div class="driving_save" >
    <el-form ref="form" :model="violationForm" label-width="80px" >
      <!--          v-model="carList"-->
      <el-form-item label="车牌号码" >
        <el-select v-model="violationForm.carId" placeholder="请选择违车牌号码" :disabled="violationForm.carId!==carList.carNo?true:false">
          <el-option
            v-for="item in carList"
            :key="item.id"
            :label="item.carNo"
            :value="item.id">
          </el-option>
        </el-select>
      </el-form-item>

      <el-form-item label="驾驶人员" >
        <el-select v-model="violationForm.driverId" placeholder="请选择驾驶人员">
          <el-option
            v-for="item in driverList"
            :key="item.id"
            :label="item.name"
            :value="item.id">
          </el-option>
        </el-select>
      </el-form-item>

      <el-form-item label="违章项目" >
        <el-select v-model="violationForm.pecOption" placeholder="请选择违章项目">
          <el-option
            v-for="item in dictionaryList"
            :key="item.id"
            :label="item.text"
            :value="item.id">
          </el-option>
        </el-select>
      </el-form-item>

      <el-form-item label="违章时间">
        <el-col :span="11">
          <el-date-picker type="date" placeholder="选择日期" v-model="violationForm.pecDate" style="width: 100%;"></el-date-picker>
        </el-col>
      </el-form-item>

      <el-form-item label="违章罚款" >
        <el-input v-model="violationForm.fine"></el-input>
      </el-form-item>

      <el-form-item label="违章扣分">
        <el-input v-model="violationForm.points"></el-input>
      </el-form-item>

      <el-form-item label="违章地点">
        <el-input v-model="violationForm.pecPlace"></el-input>
      </el-form-item>

      <el-form-item label="违章备注">
        <el-input v-model="violationForm.remarks"></el-input>
      </el-form-item>

      <el-form-item>
        <el-button type="primary" @click="update()">立刻修改</el-button>
        <el-button>取消</el-button>
      </el-form-item>


    </el-form>
  </div>
</template>
<style>
.driving_save {
  width: 700px;
}
</style>

<script>
import violationApi from "@/api/violation_cjl_wzjl.js";
export default {
  data() {
    return {
      carList: {},
      driverList: {},
      dictionaryList: {},
      violationForm: {
        id: '',
        carId: '',
        pecOption: '',
        pecDate: '',
        fine: '',
        points: '',
        driverId: '',
        pecPlace: '',
        remarks: ''
      },


    }
  },
  created() {
    this.findAll()
    this.init()

  },

  methods: {
    init() {
        const id = this.$route.params.id;
        this.findById(id);
        this.violationForm.id = id
        console.log("查询id"+this.carList+"carlist"+this.violationForm+"form")

    },

    findAll() {
      violationApi.findAllCarNum().then((response) => {
        console.log("获取汽车号码牌成功");
        this.carList = response.data.carList;
        this.driverList = response.data.driverList;
        this.dictionaryList = response.data.dictionaryList;
        console.log(this.carList)
        console.log(this.driverList)
      })
    },


    findById(id) {
      violationApi.findViolationById(id).then((response) => {
        this.violationForm = response.data.violationByID
      })
    },

    update(){
      violationApi.updateViolationById(this.violationForm).then((response) => {
        this.$message({
          message: "添加成功",
          type: "success",
        });
        this.$router.push({ path: "/daily_work/violation_record" });
      })
    }

  }
}
</script>

<style>

</style>
